<script setup lang="ts">
import { ref } from "vue";
import { Reply } from "../../index";
import { getLatestReplyAPI } from "../../api/discussion";
// import ReplyItem from "./ReplyItem.vue";

const latestReplies = ref<Reply[]>([]);

getLatestReplyAPI()
  .then((response) => {
    if (response.status !== 200) {
      throw new Error("网络错误");
    }
    return response.data;
  })
  .then((result) => {
    latestReplies.value = result.data;
  });
</script>

<template>
  <div class="p-3 bg-white">
    <div
      v-for="reply in latestReplies"
      :key="reply.id"
      class="my-1 pb-2 w-full"
    >
      <span class="text-green-700">{{ reply.publisherName }}:&nbsp;</span>
      <span class="opacity-30"
        >{{ reply.content.substring(0, 15)
        }}{{ reply.content.length > 15 ? "..." : "" }}</span
      >
    </div>
  </div>
</template>

<style scoped></style>
